<div class="test-container">
    <div class="test-header">

        <input type="text" id="filter-text-box" style="width: 100px;" oninput="onQuickFilterChanged()" placeholder="Filter..." />

        <span style="padding-left: 20px;">
            <b>Period:</b>
            <button onclick="onChangeMonth(-1)"><i class="fa fa-chevron-left"></i></button>
            <button onclick="onChangeMonth(1)"><i class="fa fa-chevron-right"></i></button>
            <span id="monthName" style="width: 100px; display: inline-block;">Year to Jan</span>
        </span>

        <span style="padding-left: 20px;">
            <b>Legend:</b>&nbsp;&nbsp;
            <div class="cell-bud legend-box"></div> Actual&nbsp;&nbsp;
            <div class="cell-act legend-box"></div> Budget
        </span>
    </div>
    <div style="height: 100%;" id="myGrid" class="ag-theme-quartz">
    </div>